<template>
  <PageWrapper>
    <BasicTable @register="registerTable">
      <template #toolbar>
        <a-button type="primary" @click="customHeader"> 导出表格 </a-button>
      </template>
    </BasicTable>
  </PageWrapper>
</template>
<script lang="ts" setup>
  import { BasicTable, useTable } from '/@/components/Table';
  import { PageWrapper } from '/@/components/Page';
  import { getBasicColumns, searchFormSchema } from './applyForReimbursementData';
  import { getApplyForReimbursement } from '/@/api/orderStaiistics/comprehensiveAPI';
  import { ref, toRaw } from 'vue';
  import { jsonToSheetXlsx } from '/@/components/Excel';
  import dayjs from 'dayjs';
  // import { jsonToSheetXlsx } from '/@/components/Excel';
  // import { toRaw } from 'vue';
  // import dayjs from 'dayjs';

  const [registerTable, { getDataSource }] = useTable({
    api: getApplyForReimbursement,
    title: '员工差旅报销',
    columns: getBasicColumns(),
    formConfig: {
      labelWidth: 100,
      actionColOptions: { span: 24 },
      schemas: searchFormSchema,
      fieldMapToTime: [['applyDate', ['applyDateStart', 'applyDateEnd'], 'YYYY-MM-DD']],
    },
    pagination: { pageSize: 10 },
    expandRowByClick: true,
    striped: true,
    useSearchForm: true,
    showTableSetting: true,
    bordered: true,
    showIndexColumn: true,
    tableSetting: { fullScreen: true },
  });
  function customHeader() {
    let header = {};
    let orderArr: object[] = [];
    for (let i = 0; i < getBasicColumns().length; i++) {
      // console.log(getBasicColumns()[i].title);
      let key: string = (getBasicColumns()[i].dataIndex as string) ?? '';
      header[key] = getBasicColumns()[i].title;
    }
    header['id'] = '序号';
    console.log(toRaw(getDataSource()));
    for (let k = 0; k < toRaw(getDataSource()).length; k++) {
      let data = ref({
        id: 1,
        examineApproveCode: '审批单号',
        unitId: '单位编号',
        departmentId: '部门编号',
        employeeNo: '职工编号',
        employeeName: '职工姓名',
        destination: '目的地',
        dateOfDeparture: '出发日期',
        dateOfReturn: '返程日期',
        dateOfReturnProlong: '到期日期',
        vehicle: '交通工具',
        countMeals: '用餐天数',
        moneyMeals: '伙食费补助',
        countCar: '用车天数',
        moneyCar: '市内交通费补助',
        sumMoney: '合计金额',
      });
      let record = getDataSource()[k];
      data.value.id = k + 1;
      data.value.examineApproveCode = record.examineApproveCode ? record.examineApproveCode : '-';
      data.value.unitId = record.examineApprove.unitId ? record.examineApprove.unitId : '-';
      data.value.departmentId = record.examineApprove.departmentId
        ? record.examineApprove.departmentId
        : '-';
      data.value.employeeNo = record.examineApprove.employeeNo
        ? record.examineApprove.employeeNo
        : '-';
      data.value.employeeName = record.examineApprove.employeeName
        ? record.examineApprove.employeeName
        : '-';
      data.value.destination = record.examineApprove.destination
        ? record.examineApprove.destination
        : '-';
      data.value.dateOfDeparture = record.examineApprove.dateOfDeparture
        ? dayjs(record.examineApprove.dateOfDeparture).format('YYYY/MM/DD HH:mm:ss')
        : '-';
      data.value.dateOfReturn = record.examineApprove.dateOfReturn
        ? dayjs(record.examineApprove.dateOfReturn).format('YYYY/MM/DD HH:mm:ss')
        : '-';
      data.value.dateOfReturnProlong = record.examineApprove.dateOfReturnProlong
        ? dayjs(record.examineApprove.dateOfReturnProlong).format('YYYY/MM/DD HH:mm:ss')
        : '-';
      data.value.vehicle = record.examineApprove.vehicle ? record.examineApprove.vehicle : '-';
      data.value.countMeals = record.examineApprove.countMeals
        ? record.examineApprove.countMeals
        : 0;
      data.value.countMeals = record.countMeals ? record.countMeals : 0;
      data.value.moneyMeals = record.moneyMeals ? record.moneyMeals : 0;
      data.value.countCar = record.countCar ? record.countCar : 0;
      data.value.moneyCar = record.moneyCar ? record.moneyCar : 0;
      data.value.sumMoney = data.value.moneyCar + data.value.moneyMeals;
      orderArr.push(data.value);
    }

    jsonToSheetXlsx({
      data: orderArr,
      header,
      filename: '员工报销统计' + dayjs(new Date()).format('YYYY-MM-DD') + '.xlsx',
      json2sheetOpts: {
        // 指定顺序
        header: [
          'id',
          'examineApproveCode',
          'unitId',
          'departmentId',
          'employeeNo',
          'employeeName',
          'destination',
          'dateOfDeparture',
          'dateOfReturn',
          'dateOfReturnProlong',
          'vehicle',
          'countMeals',
          'moneyMeals',
          'countCar',
          'moneyCar',
          'sumMoney',
        ],
      },
    });
  }
</script>
